<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta charset="utf-8">
	<title>活动详情</title>
	<meta name="keywords" content="">
	<meta name="description" content="">
	<meta name="author" content="">
	<link href="css/daterangepicker.min.css" rel="stylesheet">
	<link rel="stylesheet" href="css/main.css">
	<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
	<!--[if lt IE 9]>
		<script src="js/html5shiv.min.js"></script>
		<script src="js/respond.min.js"></script>
	<![endif]-->
	<meta name="renderer" content="webkit">
	<link rel="shortcut icon" href="favicon.ico">
	<style>
		[v-cloak] {
				display: none;
		}
		.flex {
			display:box;
			display:-webkit-box;
			display:-webkit-flex;
			display:-moz-box;
			display:-ms-flexbox;
			display: flex;
			height:100vh;
		}
		.flex-column {
			flex-direction: column;
		}
	</style>
</head>
<body>
<div id="app" v-cloak>	
	<header>
	</header>
	<div class="header-space"></div>
	<section class="section441">
		<div class="content">
			<a href="javascript:void(0)" @click="goToActivityInfo" class="item on">活动信息</a><a href="javascript:void(0)" @click="goToSignUpInfo" class="item">报名信息</a>
		</div>
	</section>
	<section class="section191">
		<div class="content">
			<div class="title hasImg">
				<img src="images/img101.png" alt="" class="img">
				<h2>{{activityDetail.name}}</h2>
				<div class="con">
					<p>报名人数：{{activityDetail.num}} 人</p>
					<p>状态：{{activityDetail.status}}</p>
					<p>起止时间：{{activityDetail.start}}-{{activityDetail.end}}</p>
				</div>
				<div class="operate" v-if="activityDetail.status == '报名中'">
					<a href="javascript:void(0);" v-if="groundingStatus == 1" class="btn-white" @click="editActivity">编辑</a>
					<a v-if="groundingStatus == 1" href="javascript:void(0);" class="btn-white" @click="groundingActivity">上架</a>
					<a v-if="groundingStatus == 0" href="javascript:void(0);" class="btn-white" @click="groundingActivity">下架</a>
					<a href="javascript:void(0);" v-if="groundingStatus == 1" class="btn-white" @click="deleteActivity">删除</a>
				</div>
				<div class="operate" v-if="activityDetail.status == '进行中'">
					<a href="javascript:void(0);" v-if="groundingStatus == 1" class="btn-white" @click="editActivity">编辑</a>
					<a v-if="groundingStatus == 1" href="javascript:void(0);" class="btn-white" @click="groundingActivity">上架</a>
					<a v-if="groundingStatus == 0" href="javascript:void(0);" class="btn-white" @click="groundingActivity">下架</a>
					<a href="javascript:void(0);" v-if="groundingStatus == 1" class="btn-white" @click="deleteActivity">删除</a>
				</div>
				<div class="operate" v-if="activityDetail.status == '已结束'">
					<a href="javascript:void(0);" class="btn-white" @click="deleteActivity">删除</a>
				</div>
				<div class="operate" v-if="activityDetail.status == '已下线'">
					<a href="javascript:void(0);" class="btn-white" @click="deleteActivity">删除</a>
				</div>
			</div>
			<div class="box" style="min-height: 300px;">
				{{activityDetail.content}}
				<img :src="activityDetail.detail" alt="">
			</div>
		</div>
	</section>
	<div
		v-if="showGroundingActivityToast"
		class="alert alert-conform show"
	>
		<div class="over-close"></div>
		<div class="box">
			<div class="title">提示</div>
			<div class="con">确定要{{groundingStatus == 1 ? '上架' : '下架'}}吗？</div>
			<div class="operate">
				<a href="javascript:void(0);" class="btn btn-white" @click="hideToast(1)">取消</a>
				<a href="javascript:void(0);" class="btn" @click="confirmOperate(1)">确定</a>
			</div>
		</div>
	</div>
	<div
		v-if="showDeleteActivityToast"
		class="alert alert-conform show"
	>
		<div class="over-close"></div>
		<div class="box">
			<div class="title">提示</div>
			<div class="con">确定要删除吗？</div>
			<div class="operate">
				<a href="javascript:void(0);" class="btn btn-white" @click="hideToast(2)">取消</a>
				<a href="javascript:void(0);" class="btn" @click="confirmOperate(2)">确定</a>
			</div>
		</div>
	</div>
	<footer id="footer"></footer>
</div>	
<script src="js/jquery.min.js"></script>
<script src="js/slide.min.js"></script>
<script src="js/polyfill.min.js"></script>
<script src="js/jquery.nicescroll3.7.6.min.js"></script>
<script src="js/main.js"></script>
<script src="js/vue.js"></script>
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script src="js/request.js"></script>
<script>
	$(function(){
		$("header").load("./enterpriseCommon/header.html");
		$("#footer").load("./enterpriseCommon/footer.html");
	})
	var vm = new Vue({
		el: '#app',
		data () {
			return {
				id: this.getRequest().id || '',
				showGroundingActivityToast: false,
				showDeleteActivityToast: false,
				groundingStatus: '',
				activityDetail: ''
			}
		},
		mounted () {
			this.fetchActivityDetail();
		},
		methods: {
			fetchActivityDetail() {
				var vm = this;
				var url = 'enterprise/activity/detail/' + this.id;
				request( url, 'GET', '',
					function (res) {
						console.log(res);
						vm.activityDetail = res.data;
						vm.groundingStatus = res.data.status_online;
					},
					function (err) {
						var msg = err.responseJSON ? err.responseJSON.message : '操作失败'
            vm.$message({
              type: 'warning',
              message: msg
            })
					}
				)
			},
			editActivity() {
				location.href = "49.html?id=" + this.id;
			},
			groundingActivity() {
				this.showGroundingActivityToast = true;
			},
			deleteActivity() {
				this.showDeleteActivityToast = true;
			},
			hideToast(type) {
				if(type === 1) {
					this.showGroundingActivityToast = false;
				}
				if(type === 2) {
					this.showDeleteActivityToast = false;
				}
			},
			confirmOperate(type) {
				var vm = this;
				if(type === 1) {
					this.showGroundingActivityToast = false;
					var doDownUpStatus = 0;
					if (this.groundingStatus === 0) {
						doDownUpStatus = 1;
					}
					request( 'enterprise/activity/doDownUp/' + this.id, 'PUT', JSON.stringify({
						status: doDownUpStatus
					}),
						function (res) {
							console.log(res);
							vm.groundingStatus = doDownUpStatus;
							vm.$message.success(res.message);
						},
						function (err) {
							var msg = err.responseJSON ? err.responseJSON.message : '操作失败'
							vm.$message({
								type: 'warning',
								message: msg
							})
						}
					)
				}
				if(type === 2) {
					request('enterprise/activity/' + this.id, 'DELETE', '',
						function (res) {
							console.log(res);
							vm.showDeleteActivityToast = false;
							location.href = '43.html';
						},
						function (err) {
							var msg = err.responseJSON ? err.responseJSON.message : '操作失败'
							vm.$message({
								type: 'warning',
								message: msg
							})
						}
					)
				}
			},
			goToActivityInfo() {
				location.href = '44.html?id=' + this.id;
			},
			goToSignUpInfo() {
				location.href = '42.html?id=' + this.id;
			},
			getRequest() {  
				var url = location.search;
				var theRequest = {};
				var strs = []
				if (url.indexOf("?") != -1) {
					var str = url.substr(1);
					strs = str.split("&");
					for(var i = 0; i < strs.length; i ++) {
							theRequest[strs[i].split("=")[0]]=(strs[i].split("=")[1]);
					}
				}
				return theRequest;
			}
		}
	})
</script>
</body>
</html>